/*
 * kit.jquery.ui.js 定制功能
 * @import "jquery-ui.min.js"
 * add by :chuilee
 * date: 2014-01-17
 */

;( function(window, document, $, undefined){
		   
// 增加自定义输入框控件
$.widget( "kit.inputbox", {
 options: {
    disabled: null,
    inputClass: null,
    icon: {
        iconClass: null,
        position: null
    }
 },

 _create: function() {
    var that = this,
        inputClass = "";
    if( this.options.inputClass ){
        inputClass = this.options.inputClass;
    }
    this.element.wrap("<span>");
    this.wrapper = this.element.parent().addClass("kit-select kit-input-prepend " + inputClass );

    if ( typeof this.options.disabled !== "boolean" ) {
        this.options.disabled = !!this.element.prop( "disabled" );
    } else {
        this.element.prop( "disabled", this.options.disabled );
    }
    if( this.options.disabled ) {
        this.wrapper.addClass( "kit-input-container-disabled" )
    }

    this.wrapper.bind( "mouseenter"+this.eventNamespace, function(){
                        if( that.options.disabled ) {
                           return ;
                        }
                        $(this).addClass( "kit-input-state-hover" );
                      } )
                .bind( "mouseleave"+this.eventNamespace, function(){
                        if( that.options.disabled ) {
                           return ;
                        }
                        $(this).removeClass( "kit-input-state-hover" );
                      } )

    this._resetInputbox();
    this._on({
        focus: function(){
            this.wrapper.addClass("kit-input-state-focus");
        },
        blur: function(){
            this.wrapper.removeClass("kit-input-state-focus");
        }
    })
},

_resetInputbox: function(){
    var icon = this.options.icon;
    if( icon.iconClass ){
        if( icon.position == "right" ){
            $("<span>").appendTo( this.wrapper ).addClass( icon.iconClass );
        }else{
            $("<span>").insertBefore( this.element ).addClass( icon.iconClass + " kit-icon" );
        }
    }
},

_destroy: function() {
    this.wrapper.remove();
    this.element.show();
}
});

// 增加自定义下拉列表框控件 date:2014-01-21
$.widget( "kit.combobox", {
       options : {
            disabled : null,
            inputClass: null,
            // callbacks
            select: null
       },
        _create: function() {
            var wrapper_h,
                inputClass = "";
                this.style="style1";

            if( this.options.inputClass ){
               inputClass = this.options.inputClass;
            }
            this.wrapper = $( "<span>" )
                .addClass( "custom-combobox " + inputClass )
                .insertAfter( this.element );

            if( this.element.parent().hasClass( "filter-head" ) ){
                this.style="style2";  // 设置在panel下的搜索条件样式
                this._on(this.wrapper,{
                    mouseenter: function(event){
                        var target = $( event.currentTarget );
                        target.addClass( "hover" );
                    },
                    mouseleave: function(event){
                        var target = $( event.currentTarget );
                        target.removeClass( "hover" )
                    }
                })
            }

            this.element.hide();

            if( this.style == "style1" ){
                this._createAutocomplete1();
            }else if( this.style == "style2" ){
                this._createAutocomplete2();
            }
            wrapper_h = this.wrapper.outerHeight();
            this._resetCombobox();  // 重新设置 下拉列表框
            this.wrapper.find( ".ui-corner-all" ).removeClass( "ui-corner-all" );  // 删掉圆角样式
        },

        _createAutocomplete1: function() {
            var selected = this.element.children( ":selected" ),
//					value = selected.val() ? selected.text() : "",
                value = selected.text(),
                selectlists_w = 0,
                that = this;
            this.input = $( "<input>" )
                .appendTo( this.wrapper )
                .val( value )
                .attr( "title", "" )
                .addClass( "input-small" )
                .autocomplete({
                    delay: 200,
                    minLength: 0,
                    source: $.proxy( this, "_source" ),
                    appendTo: this.wrapper,
                    position: {
                        my: "left top-1",
                        at: "left bottom",
                        of: that.wrapper
                    },
                    open: function(event,ui){
                        selectlists_w = $(this).outerWidth() + 6;
                        $(this).autocomplete( "widget" )
                                                        .css( { "width" : selectlists_w + 25 + "px" })
                                                        .position({
                                                            my:"left top",
                                                            at:"left bottom",
                                                            of: that.wrapper
                                                        });
                        that.wrapper.css( "z-index", "1001" );
                    },
                    close: function(event,ui){
                        that.wrapper.css( "z-index", "101" );
                        $(".inputShadow",that.wrapper).hide();
                    },
                    select: function( event, ui ){
                        that.optionData = ui;
                        $(this).parent().removeClass("kit-input-state-focus");
                    }
                })
                .tooltip({
                    tooltipClass: "ui-state-highlight"
                });
            this._on( this.input, {
                autocompleteselect: function( event, ui ) {
                    ui.item.option.selected = true;
                    this._trigger( "select", event, {
                        item: ui.item.option
                    });
                },
                autocompletechange: "_removeIfInvalid",
                autocompleteopen: function(){
                    var shadow = $(".inputShadow",that.wrapper);
                    // 增加阴影层
                    if(!shadow.size()){
                        shadow = $("<div>").addClass("inputShadow").appendTo(that.wrapper)
                    }
                    if( !that.wrapper.find("ul").is(":visible") ){
                        shadow.hide();
                        return false;
                    }
                    shadow.css({
                        height: that.wrapper.height()+that.wrapper.find("ul").height() + 1 +"px",
                        display: "block"
                    }).position({
                            my:"left+3 top+4",
                            at:"left top",
                            of: that.wrapper
                        });
                }
            });
        },

        _createAutocomplete2: function() {
          var selected = this.element.children( ":selected" ),
//                  value = selected.val() ? selected.text() : "",
                value = selected.text(),
              selectlists_w = 0,
              that = this;

          this.input = $( "<input>" )
              .appendTo( this.wrapper )
              .val( value )
              .attr( "title", "" )
              .addClass( "custom-combobox-input ui-widget ui-widget-content ui-state-default kit-input" )
              .autocomplete({
                  delay: 0,
                  minLength: 0,
                  source: $.proxy( this, "_source" ),
                  appendTo: this.wrapper,
                  position: {
                      my: "left top",
                      at: "left bottom-1",
                      of: that.wrapper.parent()
                  },
                  open: function(event,ui){
                      selectlists_w = $(this).outerWidth() + 6;
                      $(this).autocomplete( "widget" ).css( { "width" : that.wrapper.parent().outerWidth() + 20 +"px" });
                      that.wrapper.addClass( "kit-state-open" ).css( "z-index", "1001" );
                      if( !that.wrapper.find("hr").size() ){
                          that.hr = $( "<hr />").css({
                              height:"1px",
                              width:"100%",
                              background:"#fff",
                              position:"absolute",
                              top:"20px",
                              left:"0",
                              border:"0",
                              zIndex:"101"
                          }).appendTo( that.wrapper )
                      };
                  },
                  close: function(event,ui){
                      that.wrapper.removeClass( "kit-state-open" ).css( "z-index", "101" );
                      that.hr.remove()
                  },
                  select: function( event, ui ){
                      that.optionData = ui;
                  }
              })
              .tooltip({
                  tooltipClass: "ui-state-highlight"
              });
          //alert( this.input.autocomplete( "widget" ).children().length )
          this._on( this.input, {
              autocompleteselect: function( event, ui ) {
                  ui.item.option.selected = true;
                  this._trigger( "select", event, {
                      item: ui.item.option
                  });
              },

              autocompletechange: "_removeIfInvalid"
          });
        },

        _createShowAllButton: function() {
            var input = this.input,
                wasOpen = false;

            $( "<a>" )
                .attr( "tabIndex", -1 )
                .attr( "title", "Show All Items" )
                .tooltip()
                .appendTo( this.wrapper )
                .button({
                    icons: {
                        primary: "ui-icon-triangle-1-s"
                    },
                    text: false
                })
                .removeClass( "ui-corner-all" )
                .addClass( "custom-combobox-toggle ui-corner-right" )
                .mousedown(function() {
                    wasOpen = input.autocomplete( "widget" ).is( ":visible" );
                })
                .click(function() {
                    input.focus();

                    // Close if already visible
                    if ( wasOpen ) {
                        return;
                    }

                    // Pass empty string as value to search for, displaying all results
                    input.autocomplete( "search", "" );
                });
        },

        _source: function( request, response ) {
            var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
            response( this.element.children( "option" ).map(function() {
                var text = $( this ).text();
                //if ( this.value && ( !request.term || matcher.test(text) ) )
                if ( !request.term || matcher.test(text) )
                    return {
                        label: text,
                        value: text,
                        option: this
                    };
            }) );
        },

        _removeIfInvalid: function( event, ui ) {

            // Selected an item, nothing to do
            if ( ui.item ) {
                return;
            }

            // Search for a match (case-insensitive)
            var value = this.input.val(),
                valueLowerCase = value.toLowerCase(),
                valid = false;
            this.element.children( "option" ).each(function() {
                if ( $( this ).text().toLowerCase() === valueLowerCase ) {
                    this.selected = valid = true;
                    return false;
                }
            });

            // Found a match, nothing to do
            if ( valid ) {
                return;
            }

            // Remove invalid value
            this.input
                .val( "" )
                .attr( "title", value + " 不存在,请重新输入" )
                .tooltip({
                    position: { my: "left top", at: "left-6 bottom" }
                })
                .tooltip( "open" );
            this.element.val( "" );
            this._delay(function() {
                this.input.tooltip( "close" ).attr( "title", "" );
            }, 2500 );
            this.input.data( "ui-autocomplete" ).term = "";
        },

        _destroy: function() {
            this.wrapper.remove();
            this.element.show();
        },

        // 重新设置 combobox , date:2014-01-21 ;
        _resetCombobox: function() {
            var input = this.input,
                wasOpen = false,
                that = this,
                buttonClass = "",
                buttonIcon = "";
            if( this.style == "style1" ){
                buttonIcon = "kit-icon kit-icon-updown";
                buttonClass = "prefix border-left"
            }else if( this.style=="style2" ){
                buttonIcon="kit-icon kit-icon-updown1";
                buttonClass = "prefix"
            }
            input.removeClass( "ui-corner-left" )
                      .inputbox({
                           disabled : that.options.disabled,
                           icon: {
                               iconClass: buttonClass,
                               position: "right"
                           }
                      });

            // 点击下拉箭头，显示下拉列表
            if( this.options.disabled ){
               $( ".prefix" , this.wrapper ).addClass( "kit-state-disabled" )
            }
            if( !$( ".prefix" , this.wrapper).find("a").size() ){
                $( ".prefix" , this.wrapper).append( "<a class='"+buttonIcon+"' href='javascript:;'></a>" );
            }

            $( ".prefix" , this.wrapper )
                .attr( "tabIndex", -1 )
                .mousedown(function() {
                    wasOpen = input.autocomplete( "widget" ).is( ":visible" );
                })
                .click( function() {
                    input.focus();
                    if ( wasOpen ) {
                        return;
                    }
                    if( !that.options.disabled ){
                        input.autocomplete( "search", "" );
                        return false;
                    }
                } );
        },

      // 获取input输入对话框
      getInput: function(){
          return this.input;
      },

      // 禁用下拉列表框
      _disable: function(){
          this.options.disabled = true;
          this._resetCombobox();
          this.input.attr( 'disabled', true );
      },

      // 启用下拉列表框
      _enable: function(){
          this.options.disabled = false;
          this._resetCombobox();
          this.input.attr( 'disabled', false );
      },

      // 设置显示选中选项
      setOption: function( obj ){
          var defaults = {disabled:false},
              obj = $.extend( {},defaults,obj ),
              value = obj.value,
              disable = obj.disabled;

          this.element.find("option[value='"+value+"']").attr("selected", true);

          var selectedIndex = this.element.get(0).selectedIndex,
              text = this.element.get(0).options[selectedIndex].text;
          this.input.val( text );
          if( disable ){
              this._disable();
          }else{
              this._enable();
          }
      }
    });

// 增加自定义上传文件控件 date:2014-01-22
$.widget( "kit.filebox", {
         _create: function(){
             this.container = $( "<span>" )
                               .addClass( "kit-file-contain" )
                               .insertAfter( this.element );

             this.element.addClass( "kit-filebox" ).appendTo( this.container );

             this.wrapper = $( "<span>" )
                             .addClass( "kit-upload" )
                             .insertAfter( this.container );

             this.container.appendTo( this.wrapper );

             this.input = $( "<input type='text' value='请选择上传的文件' disabled>" )
                          .addClass( "kit-fileUrl" )
                          .appendTo( this.wrapper );

             this._addUploadbtn();  // 添加模拟 '浏览...' 按钮

             this._resetFilebox();  // 添加input 用来显示文件路径

             this._on(this.element, {

                  change:function(){

                     var fileUrl = this.element.val();

                     if( fileUrl!== "" ){
                         this.input.val( fileUrl );
                     }
                  }

             })
         },
         _resetFilebox: function(){
             this.wrapper.addClass( "kit-upload" )
                         .inputbox({
                            inputClass: "kit-upload-wrapper"
                         });
             this.wrapper.parent().wrap( "<div class='kit-file-wrapper'>" )
         },
         _addUploadbtn: function(){
             $( "<a>" )
              .addClass( "kit-fileBtn" )
              .appendTo( this.wrapper )
              .text( "浏览..." )
              .button({
                text: true
              })
              .removeClass( "ui-corner-all" )
         },
         _bindChangeEvent: function(){

         }
       } )

// 增加类下拉列表，用于panel标题下切换内容 date:2014-02-12
$.widget( "kit.slidelist",{
           _create: function(){
               this.element.hide();
               this.wrapper = $( "<div>" )
                              .addClass( "kit-slidelist" )
                              .insertAfter( this.element );
               this._createContent();
               this._createSlidebtn();
               this._selectOpt();
           },
           _createContent: function(){

               var selected = this.element.children( ":selected" ),
                   value = selected.val() ? selected.text() : "";

               this.slideContain = $( "<span>" )
                                .addClass( "slide-value" )
                                .appendTo( this.wrapper );

               $( "<i class='slide-value-left' /><i class='slide-value-right' />" ).appendTo( this.slideContain );

               this.slideValue = $( "<span>" )
                                .text( value )
                                .addClass( "slide-value-middle" )
                                .appendTo( this.slideContain );

               this.slidelists = $( "<ul>" )
                                 .css( { width: this.slideValue.outerWidth() + 6 + "px"} )
                                 .appendTo( this.wrapper );

               var html = "",
                   text;
               for(var i = 0; i< this.element.children().length; i++){
                   text = this.element.children().eq(i).text();
                   if( text == "" ){
                      text =  this.element.children().eq(i).val()
                   }
                   html += "<li><a href='javascript:;'>"+ text + "</a></li>";
               }
               html += "<li class='slide-bottom'>" +
                       "<i class='slide-bottom-left'></i>" +
                       "<i class='slide-bottom-middle'></i>" +
                       "<i class='slide-bottom-right'></i></li>" ;
               $( html ).appendTo( this.slidelists );
               this.slidelists.hide();
           },
           _createSlidebtn: function(){
               var ul = this.slidelists;
               this.slideBtn = $( "<span>" )
                               .addClass( "slide-btn" )
                               .button()
                               .removeClass( "ui-corner-all" )
                               .appendTo( this.wrapper )
                               .click( function(){
                                    ul.toggle();
                               } )
           },
           _selectOpt: function(){
               var ul = this.slidelists,
                   slideValue = this.slideValue,
                   opts = this.element.children();
               ul.find( "a" ).each( function(i){
                                              $(this).click( function(){
                                                                ul.toggle();
                                                                slideValue.text( $(this).text() );
                                                                opts.eq( i ).attr("selected", "selected");
                                                            } )
                                           })
           }
       } )

// 顶部导航菜单
$.widget( "kit.navbar",{
  options:{
      containerClass:"navbar",
      mask:true,
      menuContainer:"menudrop-container",
      menuWidth:615
  },
  _create: function(){
      var nav_li = $( this.element ).find( ">li");
      this.wrapper = $( "<div />").addClass( this.options.containerClass );

      $( this.element ).wrap( this.wrapper ); // 创建菜单外层容器

      nav_li.each( function(){ // 创建向下箭头
          if( $( this ).find( "ul").size() ){
              $( "<i />").addClass("kit-icon kit-icon-arrowdown1").appendTo( $( this ).find( ">a" ) );
          }
      } );

      var showClock = [],
          hideClock = [];
      this._on( nav_li,{
          mouseenter: function(event){
              var _li = $( event.currentTarget );
              _li.addClass( "hover" )
          },
          mouseleave: function(event){
              var _li = $( event.currentTarget );
              _li.removeClass( "hover" )
          },
          click: function(event){
              var _li = $( event.currentTarget),
                  _target = $(event.target);
              if(_target.is("a")){
                  _li.find( ">a" ).addClass( "active").end().siblings().find( ">a" ).removeClass("active");
              }
          }
      } );

      this._on( nav_li.has( "ul" ), {
          "mouseenter": function( event ){
              var _li = $( event.currentTarget),
                  _this = this;
              _li.addClass( "hover" ).find( ">a >.kit-icon" ).addClass( "hover" );

              if( !_li.find( "." + this.options.menuContainer).size() ){
                  var menuContainer = $( "<div>").addClass( this.options.menuContainer ).appendTo( _li );
                  $( "<i class='kit-icon kit-icon-menuarrow'></i><div class='menudrop-shadow'></div>").appendTo( menuContainer );
                  // 创建下拉子菜单容器
                  var menudrop = $( "<div>" ).addClass( "menudrop" ).appendTo(menuContainer),
                      menu_ul = _li.find( ">ul" ),
                      menu_li = menu_ul.find( ">li" );
                  if( menu_li.size() > 4 ){
                      var menubox = [];
                      menubox[1] = $("<div>").addClass( "menubox" ).append( "<ul>" ).appendTo( menudrop );
                      menubox[2] = $("<div>").addClass( "menubox" ).append( "<ul>" ).appendTo( menudrop );
                      for( var i=0; i < menu_li.size(); i++ ){
                          if( i%2 == 0 ){
                              menu_li.eq(i).appendTo( menubox[1].find( ">ul" ) );
                          }else{
                              menu_li.eq(i).appendTo( menubox[2].find( ">ul" ) );
                          }
                          menudrop.width( this.options.menuWidth )
                      }
                      menu_ul.remove();
                  }else{
                      var menubox = $( "<div>").addClass( "menubox").append( menu_ul );
                      menubox.appendTo( menudrop );
                  }
                  _li.find(".menubox").each(function(){
                      $(this).find(">ul >li").each(function(){
                          $(this).addClass("list-1");
                          if($(this).find("li").size()){
                              $(this).find("li").addClass("list-2");
                          }
                      }).filter( ":last-child").addClass( "list-last" );
                  });
                  //  如果没有三级菜单时, 添加一个新的样式
                  if(!_li.find(".list-2").size()){
                      _li.find(".menubox").addClass("menubox2")
                          .end().find(".list-1:last").addClass("list-last");
                  }
              }

              var offset_l = _li.offset().left,
                  window_w = $( window ).outerWidth(),
                  margin_l = 0,
                  arrow = _li.find( ".kit-icon-menuarrow" ),
                  arrow_l = parseInt(arrow.css("left"),10),
                  menuContainer = _li.find( "." + this.options.menuContainer);

              if( window_w - offset_l < menuContainer.outerWidth() ){
                  margin_l = window_w - offset_l - this.options.menuWidth - 10;
                  menuContainer.css( "margin-left",margin_l );
                  arrow.css( "left", ( _li.width()-14 )/2 - margin_l ); // 指示箭头位置
              }else{
                  arrow.css( "left", (_li.width()-14)/2 );
              }

              if( !_li.find( "." + _this.options.menuContainer).hasClass( "show" ) ){
                  showClock[_li.index()] = setTimeout( function(){
                      _li.find( "." + _this.options.menuContainer).addClass( "show" );
                  },300 )
              }else{
                  clearTimeout( hideClock[_li.index()] )
              }
          },
          "mouseleave":function(event){
              var _li = $( event.currentTarget),
                  _this = this;

              _li.removeClass( "hover" ).find( ">a >.kit-icon" ).removeClass( "hover" );;

              if( showClock[_li.index()] ){
                  clearTimeout( showClock[_li.index()] );
              }
              hideClock[_li.index()] = setTimeout(function(){
                  _li.find( "." + _this.options.menuContainer).removeClass( "show" );
              },300)
          }
      } );

      this._bindDropmenu();
  },
  _bindDropmenu: function(){
      this._on($(this.element),{
          click: function(event){
              var target = $(event.target)
              if(target.is("a")&&target.parents(".menudrop").size()){
                  var menudrop = target.parents(".menudrop");
                  menudrop.find(".kit-state-active").removeClass("kit-state-active");
                  target.addClass("kit-state-active");
                  if(target.parents(".list-1").size()){
                      target.parents(".list-1").find(">a").addClass("kit-state-active");
                  }
              }
          }
      })
  }
} )

// 增加自定义输入框控件
$.widget( "kit.panelinput", {
    options: {
        disabled: null,
        inputClass: null,
        icon: {
            iconClass: null,
            position: null
        }
    },

    _create: function() {
        var that = this,
            inputClass = "";
        if( this.options.inputClass ){
            inputClass = this.options.inputClass;
        }
        this.element.wrap("<span>");
        this.wrapper = this.element.parent().addClass("kit-select kit-input-prepend " + inputClass );

        if ( typeof this.options.disabled !== "boolean" ) {
            this.options.disabled = !!this.element.prop( "disabled" );
        } else {
            this.element.prop( "disabled", this.options.disabled );
        }
        if( this.options.disabled ) {
            this.wrapper.addClass( "kit-input-container-disabled" )
        }

        this.wrapper.bind( "mouseenter"+this.eventNamespace, function(){
            if( that.options.disabled ) {
                return ;
            }
            $(this).addClass( "kit-input-state-hover" );
        } )
            .bind( "mouseleave"+this.eventNamespace, function(){
                if( that.options.disabled ) {
                    return ;
                }
                $(this).removeClass( "kit-input-state-hover" );
            } )

        this._resetInputbox();
    },

    _resetInputbox: function(){
        var icon = this.options.icon;
        if( icon.iconClass ){
            $("<span>").appendTo( this.wrapper ).addClass( icon.iconClass );

            if( icon.position == "right"  ){
                this.element.addClass( "icon-right" );
                return ;
            }
            this.element.addClass( "icon-left" );
        }
    },

    _destroy: function() {
        this.wrapper.remove();
        this.element.show();
    }
});

$.widget("kit.setButton",{
  options:{
     icon:true,
     iconClass:"kit-icon-ok",
     state:"normal"
  },
  _create: function(){
          var _this = $(this.element),
              buttonClass;

          _this.addClass( "kit-button" );
          $( "<span class='button-left'></span><span class='button-right'></span>" )
              .appendTo(_this);
          if(!this.options.icon){
              _this.button().removeClass( "ui-corner-all" );
              return false;
          }
          switch (this.options.state){
              case "warn":
                  buttonClass = "kit-button-warn";
                  break;
              case "disable":
                  buttonClass = "kit-button-disabled";
                  break;
              case "prompt":
                  buttonClass = "kit-button-prompt";
                  break;
              case "success":
                  buttonClass = "kit-button-success";
                  break;
              default :
                  buttonClass = "";
                  break;
          }
          _this.addClass(buttonClass).button({
              icons: {
                  primary: this.options.iconClass +" kit-icon"
              }
          }).removeClass( "ui-corner-all" );
  }
});

$.widget( "kit.autocompletebox", {
    options: {
        source: "none",
        appendTo: null
    },
    _create: function(){
        var autocompleteObj,width,inputshadow,shadow_h,shadow_w,
            hideClearBtn = null,
            that = this;
        this.wrapper = $( this.element ).parent();
        autocompleteObj = $( this.element ).autocomplete( {
                                source: this.options.source,
                                select: function( event, ui ){
                                    $( this ).val( ui.item.label ).data( "value", ui.item.value );
                                    return false;
                                },
                                focus: function( event, ui ){
                                    return false;
                                },
                                minLength: 0
                            } ).autocomplete( "widget" );

        inputshadow = that.wrapper.siblings( ".inputShadow");
        if( !inputshadow.size() ){
            inputshadow = $("<div>").addClass( "inputShadow").insertBefore( that.wrapper );
        }
        this.clearButton = this.wrapper.find( ".clearText" );
        $( this.element ).on( {
            "autocompleteopen": function(){
                width = that.wrapper.outerWidth() - 2;
                that.wrapper.css( "z-index", 1001 );
                autocompleteObj.removeClass( "ui-corner-all").width(width).position( {
                    my: "left top",
                    at: "left bottom",
                    of: that.wrapper
                } );
                shadow_h = that.wrapper.outerHeight() + autocompleteObj.outerHeight();
                shadow_w = autocompleteObj.outerWidth();
                inputshadow.css( {
                    width: shadow_w + "px",
                    height: shadow_h + "px",
                    zIndex: 100,
                    display: "block"
                } ).position( {
                        my: "left+2 top+2",
                        at: "left top",
                        of: that.wrapper
                    } )
            },
            "autocompleteclose": function(){
                inputshadow.hide().css( "z-index",1 );
                that.wrapper.css( "z-index",1 );
            },
            "focus": function(){
                that._clearInputText();
                if( hideClearBtn ){
                    clearTimeout( hideClearBtn );
                }
            },
            "keyup": function(){
                that._clearInputText();
            },
            "blur": function(){
                if( hideClearBtn ){
                    clearTimeout( hideClearBtn );
                }
                hideClearBtn = setTimeout( function(){
                    that.clearButton.delay(1000).hide();
                }, 100 )
            }
        } );
    },
    _clearInputText: function(){
        var _input = $( this.element),
            that = this;
        if( _input.val().replace( /\s/g, "" ).length ){
            if( !this.clearButton.size() ){
                this.clearButton = $("<button>")
                                        .addClass( "clearText" )
                                        .text( "清除")
                                        .insertAfter( _input)
                                        .on({
                                            "click": function(e){
                                                e.preventDefault();
                                                _input.val( "" );
                                                that.clearButton.hide();
                                            },
                                            "mouseenter": function(){
                                                $( this).addClass( "ui-state-hover" );
                                            },
                                            "mouseleave": function(){
                                                $( this).removeClass( "ui-state-hover" );
                                            }
                                        });
            };
            this.clearButton.show()
        }
    }
} );

$.widget( "kit.checkCombobox", {
    options: {
        disable: false
    },
    _create: function(){
        var that = this,
            lists = "";

        this.checkOptions = $( this.element).find( "input[type=checkbox]" );
        this.listWrapper = $( "<ul>").appendTo( $( this.element ));
        this.checkOptions.wrap( "<li>");
        this.masklayer = $( "<div>").addClass( "inputShadow").appendTo( $( this.element ) );
        this.checkOptions.each( function(){
            var label = "<label for='"+ this.id +"'>" + $( this).data( "label" ) + "</label>" +
                "<span>" + $( this).data( "label" ) + "</span>";
            $( label).insertAfter( $( this ) );
        } );

        this.lists = $(this.element).find( "li" );
        this.lists.appendTo( this.listWrapper );

        $(this.element).addClass( "kit-checkbox kit-checkCombobox" ).buttonset();

        var inputVal = "";
        this.lists.find( "input:checked").each( function(){
            inputVal += "," + $( this).data( "label" );
        } )
        inputVal = inputVal.replace( /^\,/, "" );

        this.input = $( "<input>").addClass( "input-small" )
                        .appendTo( this.element )
                        .val( inputVal)
                        .on({
                            "focus": function(){
                                that._showItems();
                            }
                        })
                        .inputbox();
        // 添加下拉箭头
        this._createShowAllButton();

        // 绑定选择事件
        this._selectItem();

        if( this.options.disable ){
            this._disable();
            return;
        }

        // 关闭下拉列表
        $( "body").on( {
            "mousedown": function(e){
                var target = $( e.target );
                if( !target.is( ".kit-checkCombobox" ) && !target.parents( ".kit-checkCombobox").size() ){
                    $( ".kit-checkCombobox").checkCombobox( "hideItems" );
                }
            },
            "click": function(e){
                var target = $( e.target );
                if( target.is( ".prefix" ) || target.parents( ".prefix").size() ){
                    if( that.listWrapper.is( ":visible" ) ){
                        $( ".kit-checkCombobox").not( that.element ).checkCombobox( "hideItems" );
                    }

                }
            }
        } )
    },
    _hideItems: function(){
        var ele = this.element,
            listWrapper = this.listWrapper,
            masklayer = this.masklayer;
        $( ele).css( "z-index", 1 );
        listWrapper.hide();
        masklayer.hide();
    },
    _showItems: function(){
        var ele = this.element,
            listWrapper = this.listWrapper,
            input = this.input,
            masklayer = this.masklayer;
            $( ele).css( "z-index", 111 );
            listWrapper.css({
                            "display": "block",
                            "z-index": 1000,
                            "width": input.outerWidth()+ 31 + "px"
                        }).position( {
                            my: "left-6 top",
                            at: "left bottom",
                            of: input
                        } )

            masklayer.css({
                "display": "block",
                "z-index": 1,
                "width": input.outerWidth()+ 31 + "px",
                "height": listWrapper.outerHeight() + 23 + "px"
            }).position( {
                    my: "left-1 top+4",
                    at: "left top",
                    of: input
                } );
    },

    hideItems: function(){
        this._hideItems();
    },

    _selectItem: function(){
        var that = this;
        this.lists.on( {
            "click": function(e){
                var inputVal = "";
                if( $(e.target).is( "label" ) || $(e.target).parent().is( "label" ) ){
                    var label = $( this ).find( "label"),
                        input = $( this ).find( "input[type=checkbox]" );

                    that.lists.find( "input").on( "change", function(){

                        if( that.lists.find( "input:checked").size() ){

                            that.lists.find( "input:checked").each( function(){
                                inputVal += "," + $( this).data( "label" );
                            } )

                            inputVal = inputVal.replace( /^\,/, "" );
                            that.input.val( inputVal );

                        }else{
                            that.input.val("")
                        }
                    } )
                }
            },
            "mouseenter": function(){
                $( this).addClass( "ui-state-focus" );
            },
            "mouseleave": function(){
                $( this).removeClass( "ui-state-focus" );
            }

        } )
    },

    _createShowAllButton: function() {
        var that = this,
            ele = this.element,
            input = this.input,
            listWrapper = this.listWrapper,
            masklayer = this.masklayer;
        $( "<span class='prefix border-left' tabindex='-1'><a class='kit-icon kit-icon-updown' href='javascript:;'></a></span>").insertAfter( input );
        if( this.options.disable ) {
            return;
        }
        $( this.element).find( ".prefix" ).click( function(){
            if( listWrapper.is( ":visible" ) ){
                listWrapper.hide();
                $(ele).css( "z-index", 1 );
                masklayer.hide();
            }else{
                that._showItems();
            }
        } )
    },

    _disable: function(){
        var inputWrapper = this.input.parent();
            inputWrapper.addClass( "kit-input-container-disabled" );
        this.input.attr( "disabled", true ).inputbox( "option", "disabled", true )
    },

    disable: function(){
        this._disable();
        $( this.element).find( ".prefix").off( "click" );
    },
    _enable: function(){
        var inputWrapper = this.input.parent();
        inputWrapper.removeClass( "kit-input-container-disabled" );
        this.input.attr( "disabled", false ).inputbox( "option", "disabled", false )
    },
    enable: function(){
        var that = this,
            ele = this.element,
            input = this.input,
            listWrapper = this.listWrapper,
            masklayer = this.masklayer;

        this._enable();
        $( this.element).find( ".prefix a" ).click( function(){
            if( listWrapper.is( ":visible" ) ){
                listWrapper.hide();
                $(ele).css( "z-index", 1 );
                masklayer.hide();
            }else{
                that._showItems();
            }
        } )
    }

} )

})(window, document, jQuery);

$(function(){
  
  // 为按钮绑定弹出对话框事件 
  $( ".js-dialog-btn" ).on("click",function(){
	var $that = $(this);								  
    var target = $(this).data("target"),
	    addRadius = $(this).data("hasRadius") || false ,
		html = '';
	html = " <div class='radius-top'><i class='radius-left'></i><i class='radius-middle'></i><i class='radius-right'></i></div> "+
		   " <div class='radius-bottom'><i class='radius-left'></i><i class='radius-middle'></i><i class='radius-right'></i></div> "+
		   " <div class='radius-left'></div><div class='radius-right'></div> ";
    
    $( "#" + target ).dialog({
      height: 540,
      width:500,
      minWidth:400,
      minHeight:300,
      modal: true,
      resizable:false,
      buttons:[
			   {text:"确定",click:function(){ $(this).dialog( "close" );},icons:{ primary: 'kit-icon-ok'}},
               {text:"取消",click:function(){ $(this).dialog( "close" );},icons:{ primary: 'kit-icon-cancel'}}
			  ],
	  open:function(){
		var $container = $(this).dialog("widget"),
		    buttonsObj = $( this ).dialog( "option","buttons" );
			
	    if( !addRadius ){
		  $(html).appendTo($container);
		  $that.data("opened",true);
		}
		
		// 重置按钮 '确定' , '取消'
		if( buttonsObj && buttonsObj.length > 0 ){
			var $buttons = $( this ).dialog( "widget" ).find( ".ui-dialog-buttonset button" );
			 $buttons.each(function(i){
				 var _iconClass = "",
				     _buttonClass = "kit-button";
				 if( buttonsObj[i].icons.primary ){
				     _iconClass = buttonsObj[i].icons.primary  
				 }
				 if( i == 1 ){ // 取消按钮为灰色;
				    // _buttonClass += " kit-button-grey"	 
				 }
				 $(this).addClass( _buttonClass )
				        .button({
							icons: {
							    primary: _iconClass  
							}			 
						})
						.append( "<span class='button-left'></span><span class='button-right'></span>" )
			 })
		}
	  }
    });	
	
  });	
    
  // 自定义按钮
  $( "button.js-kit-button").each(function(){
      var icon_class,buttonState;
      // 为不同按钮设置不同的icon图标
      if( $(this).hasClass( "js-kit-icon-search" ) ){
          icon_class = "kit-icon-search";
      }
      if( $(this).hasClass( "js-kit-icon-ok" ) ){
          icon_class = "kit-icon-ok";
      }
      if( $(this).hasClass( "js-kit-icon-upload" ) ){
          icon_class = "kit-icon-upload";
      }
      if( $(this).hasClass( "js-kit-icon-delete" ) ){
          icon_class = "kit-icon-delete";
      }
      if( $(this).hasClass( "js-kit-icon-save" ) ){
          icon_class = "kit-icon-save";
      }
      if( $(this).hasClass( "js-kit-icon-download" ) ){
          icon_class = "kit-icon-download";
      }
      if( $(this).hasClass( "js-kit-icon-add" ) ){
          icon_class = "kit-icon-add";
      }
      if( $(this).hasClass( "js-kit-icon-edit" ) ){
          icon_class = "kit-icon-edit";
      }
      if( $(this).hasClass( "js-kit-icon-export" ) ){
          icon_class = "kit-icon-export";
      }
      if( $(this).hasClass( "js-kit-icon-import" ) ){
          icon_class = "kit-icon-import";
      }
      if( $(this).hasClass( "js-kit-icon-cancel" ) ){
          icon_class = "kit-icon-cancel";
      }
      if( $(this).hasClass( "js-kit-icon-refresh" ) ){
          icon_class = "kit-icon-refresh";
      }
      if( $(this).hasClass( "js-kit-icon-print" ) ){
          icon_class = "kit-icon-print";
      }
      if( $(this).hasClass( "js-kit-icon-back" ) ){
          icon_class = "kit-icon-back";
      }
      // 按钮设置为不能点击状态
      if( $(this).hasClass( "js-kit-disabled" ) ){
          buttonState = "disable";
          $(this).click(function(){ return false;});
      }

      // 初始告警按钮样式
      if( $(this).hasClass( "js-kit-warn" ) ){
          buttonState = "warn";
      }

      // 初始提示按钮样式
      if( $(this).hasClass( "js-kit-prompt" ) ){
          buttonState = "prompt";
      }

      // 初始提示按钮样式
      if( $(this).hasClass( "js-kit-success" ) ){
          buttonState = "success";
      }

      $(this).setButton({iconClass:icon_class,state:buttonState});
  });

  // 自定义输入框
  $( "input.js-kit-inputbox" ).each(function(){
	var _this = $(this),
		icon = null,
		disabled = null,
		inputClass = "kit-inputbox";
	_this.addClass("kit-input");

	if( _this.hasClass( "js-kit-icon-datebox" ) ){
		icon = "kit-icon-date";
	}
	if( _this.hasClass( "js-kit-disabled" ) ){
		disabled = true;
	}
    if(icon){
        _this.addClass("kit-input-icon")
    }
	_this.inputbox({
	   disabled: disabled,
	   inputClass: inputClass,
       icon: {
	     iconClass: icon
	   }
    })
  });
  
  // 自定义下拉框
  $( ".js-kit-combobox" ).each(function(){
								  var disabled = null;

								  if( $(this).hasClass( "js-kit-disabled" ) ){
									  disabled = true;
								  };
								  $(this).combobox({
								       disabled : disabled
								   });
							  });


  // panel input 框
  $( ".panel-filter").find( ".js-panelinput").each( function(){
      $(this).panelinput({
          icon: {
              iconClass: "kit-icon kit-icon-updown1",
              position: "right"
          }
      });
  });
  $( ".panel-filter" ).find( ".custom-combobox:eq(0)").find( ".kit-select").css( "background", "none" )
    // 自定义上传文件
  $( ".js-kit-filebox" ).filebox();
  
  // 搜索工具栏
  $( ".js-kit-search" ).bind({
							 
      "blur" : function(){
                   if($(this).val() == ""){
                        $(this).val("请输入您要查询的内容...");
                   }	
			   },
	  "focus" : function(){
				   if($(this).val() == "请输入您要查询的内容..."){
					    $(this).val("");
			       } 	
			   }
   });
  
  // 单选框
  $( ".js-kit-radio" ).each(function(){
						  $(this).addClass( "kit-radio" )
						         .buttonset();			 
					  });
  
  // 复选框
  $( ".js-kit-checkbox" ).each(function(i){
						  $(this).addClass( "kit-checkbox" )
						         .buttonset();     
					  });

  // 复选下拉列表框
  $( ".js-kit-checkCombobox" ).checkCombobox();


  // 输入文本框
  $( ".js-kit-textarea" ).resizable({
			                 handles: "se",
			                 minWidth: 200,
			                 create: function( event,ui ) {
                                 $(this).resizable("widget").css({padding:0,overflow:'visible'})
			                 }
		                 });
  
  // tabs切换内容
  $( ".js-kit-tabs" ).tabs({
					    create: function( event, ui ){
							var $tab_btns = $( this ).find( ".ui-tabs-nav >li" );
							
							$(this).removeClass( "ui-corner-all" ).addClass( "kit-tabs" )
							                        .find( ".ui-corner-all" ).removeClass( "ui-corner-all" );
							$(this).find( ".ui-widget-header" ).removeClass( "ui-widget-header" );
							$(this).find( ".ui-corner-top" ).removeClass( "ui-corner-top" );
							
							$tab_btns.each( function(){
								$("<i class='tab-btn-left'></i><i class='tab-btn-right'></i>").appendTo( $(this) );
							} )
						}
					});
  
  // slidelist 类下拉列表
  $( ".js-kit-slidelist" ).slidelist();

  // tab 切换
  $( ".js-tabs" ).tabs({
    create: function() {
        $( this).removeClass( "ui-corner-all" ).find( ".ui-corner-all").removeClass( "ui-corner-all").end().find( ".ui-corner-top").removeClass( "ui-corner-top" );
    }
  })

});

function alertInfos(args){
    var defaults = {
            state:"success",
            container:"",
            targetId:"alertInfo",
            message:"你已经完成了对当前数据的修改！",
            timer:3000,
            button:{
               text:'我知道了',
               click: $.noop
            }
        },
        options,
        container,
        alert;
    var states = {success:1,warn:2,error:3};  // 只有成功，警告，提示 三种状态
    if(typeof args == "object"){
        options = $.extend({},defaults,args);
        if($(options.container).size()){
            container = $(options.container);
        }else {
            container = $("body");
        }
        if( container.find("#"+options.targetId).size() ){
            container.find("#"+options.targetId).remove();
        }

        alert = $("<div>").attr("id",options.targetId).addClass("alert-state-"+options.state).appendTo( container );
        $("<span class='info'><i class='kit-icon-medium kit-icon-info'></i>"+options.message+"</span><i class='line left'></i><i class='line right'></i>").appendTo( alert );

        if(states[options.state] == 3){
            var button = $("<button type='button'></button>").text(options.button.text).appendTo(alert.find(".info"));
            button.setButton({iconClass:"kit-icon-ok",state:"warn"}).click(function(){
                options.button.click();
                alert.slideUp(500,function(){
                    $(this).remove();
                });
            });
        }else{
            setTimeout(function(){
                alert.slideUp(500,function(){
                    $(this).remove();
                })
            },options.timer)
        }
    }
};